<template>
	<view class="container">
		<view class="tui-list-cell" @tap="click_location">
			<view class="tui-bold tui-cell-title">收货地址</view>
			<view class="tui-addr-box">
				<view class="tui-addr-item">{{location?location:'请设置收货地址'}}</view>
			</view>
			<tui-icon name="more-fill" :size="20" class="tui-right" color="#666"></tui-icon>
		</view>
		<tui-swipe-action :actions="actions"  @click="handlerButton" v-for="(item,index) in list"
		 :key="index" :params="index">
			<template v-slot:content>
				<view class="list-item">
					<view class="checkbox-box1" @tap="on_click_product" :data-index="index">
						<view class="checkbox">
							<view :class="item.on?'on':''"></view>
						</view>
					</view>
					<image :src="item.image_url" class="item-img" @tap="product_detail" :data-id="item.product_id"></image>
					<view class="item-box">
						<view class="item-title">{{item.name}}</view>
						<view class="item-title">{{item.specs}}</view>
						<view class="money">
							<view class="item-time">{{item.total_money}}</view>
							<uni-number-box :value="item.num" :min="1" :max="99" @change="change($event,index)"></uni-number-box>
						</view>	
					</view>
				</view>
			</template>
		</tui-swipe-action>
		<!-- 脚部菜单 -->
		<view class="footer" :style="{bottom:footerbottom}">
			<view class="checkbox-box" @tap="all_select">
				<view class="checkbox">
					<view :class="on_all?'on':''"></view>
				</view>
				<view class="text">全选</view>
			</view>
			<view class="settlement">
				<view class="sum">合计:<view class="money">￥{{total_money}}</view></view>
				<view class="btn" @tap="add_cart_order">结算({{total_num}})</view>
			</view>
		</view>
	</view>
</template>

<script>
	import tuiSwipeAction from "@/components/swipe-action/swipe-action"
	import uniNumberBox from "@/components/uni-number-box/uni-number-box"
	import tuiIcon from "@/components/icon/icon"
	import Cart from './cart-model.js'
	var cart = new Cart();  
	export default {
		components:{
			tuiSwipeAction,
			uniNumberBox,
			tuiIcon
		},
		data() {
			return {
				list: [],
				actions: [{
						name: '删除',
						color: '#fff',
						fontsize: 30,//单位upx
						width: 80, //单位px
						//icon: 'like.png',//此处为图片地址
						background: '#ed3f14'
					}
				],
				location:'',
				footerbottom:0,
				total_num:0,//总件数
				total_money:'0.00',//总价
				on_all:false,//是否全选
			}
		},
		onLoad() {
			//兼容H5下结算条位置
			// #ifdef H5
				this.footerbottom = document.getElementsByTagName('uni-tabbar')[0].offsetHeight+'px';
			// #endif
		},
		onShow() {
			var that = this;
			that.cart_list();
			that.get_user_site();
			that.total_num=0;
			that.total_money='0.00';
			that.on_all=false;
			that.my();
		},
		methods: {
			get_user_site(){
				var that = this;
				cart.get_user_site((res)=>{
					if(res.code == 8888){
						that.location = res.data.location;
					}
				})
			},
			cart_list(){
				var that = this;
				cart.cart_list((res)=>{
					if(res.code == 8888){
						that.list = res.data.info;
					}
				})
			},
			//删除商品
			handlerButton(e) {
				var that = this;
				var index = e.item;
				cart.show_modal({content:'确定要删除该商品吗！'},(res)=>{
					if (res.confirm) {
						cart.cart_delete(that.list[index].id,(res)=>{
							if(res.code == 8888){
								that.list = cart.delete_arr_index(that.list,index);
								cart.count_cart(that);
							}
						})
					}	
				})
			},
			//商品加减
			change(value,index){
				var that = this;
				cart.change(that,value,index);
			},
			//商品选中
			on_click_product(e){
				var that = this;
				var index = cart.get_data_set(e,'index');
				that.list[index].on = !that.list[index].on;
				cart.count_cart(that);
			},
			//全选全不选
			all_select(){
				var that = this;
				cart.all_select(that);
			},
			//商品详情
			product_detail(e){
				var id = cart.get_data_set(e,'id');
				cart.navigate_to('../product_detail/product_detail?id='+id);
			},
			click_location(){
				cart.navigate_to('../location/location');
			},
			add_cart_order(){
				var that = this;
				var arr = [];
				for(var i = 0;i < that.list.length;i++){
					if(that.list[i].on){
						arr.push(that.list[i].id);
					}
				}
				if(arr.length>0){
					cart.add_cart_order({ids:arr},(res)=>{
						if(res.code == 8888){
							cart.navigate_to('../order/order');
						}
					})
				}else{
					cart.show_tips({title:'请选择商品！'});
				}
			},
			my(){
				cart.my((res)=>{
					if(res.code==8888){
						if(res.data.status_num>99){
							res.data.status_num = '99';
						}
						if(res.data.cart_count>99){
							res.data.cart_count = '99';
						}
						if(res.data.status_num>0){
							uni.setTabBarBadge({
							  index: 3,
							  text:res.data.status_num
							})
						}else{
							uni.removeTabBarBadge({
							  index: 3
							})
						}
						if(res.data.cart_count>0){
							uni.setTabBarBadge({
							  index: 2,
							  text:res.data.cart_count
							})
						}else{
							uni.removeTabBarBadge({
							  index: 2
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
	@import url("cart.css");
</style>
